<template>
  <div>
    <el-dialog title="修改订单" :visible="dialogVisible" :close-on-click-modal="false" @close="close" width="800px">

      <el-form :model="ruleForm" ref="ruleForm" :inline="true" label-width="100px" :rules="rules" class="demo-ruleForm">

        <!--         
        <el-form-item label="修改价格:" prop="changeAmount">
         <el-input type="number" :min="orderInfo.sellerAcceptedAmount" v-model="ruleForm.changeAmount" ></el-input>
        </el-form-item> -->
        <el-form-item label="订单编号:" prop="no">
          <span>{{orderInfo.no}}</span>
        </el-form-item><br/>
        <el-form-item label="游戏账号:" prop="accountNumber">
          <el-input v-model="ruleForm.accountNumber" type="text" placeholder="请输入游戏账号"></el-input>
        </el-form-item>
        <el-form-item label="密码:" prop="accountPassword">
          <el-input v-model="ruleForm.accountPassword" type="text" placeholder="请输入密码"></el-input>
        </el-form-item>
        <el-form-item label="绑定手机号:" prop="securityPhone">
          <el-input v-model="ruleForm.securityPhone" type="text" placeholder="请输入绑定手机号"></el-input>
        </el-form-item>
        <el-form-item label="回收金额:" prop="backAmount" v-if="ruleForm.buyerPayStatus==1">
          <el-input v-model="ruleForm.backAmount" type="text" placeholder="请输入回收金额"></el-input>
        </el-form-item>
        <el-form-item label="包赔费:" prop="guaranteeAmount" v-if="orderInfo.guaranteeTenantId&&ruleForm.buyerPayStatus==1">
          <el-input v-model="ruleForm.guaranteeAmount" type="text" placeholder="请输入包赔费"></el-input>
        </el-form-item>

        <el-form-item label="备注:" prop="remark">
          <el-input style="width:500px" type="textarea" v-model="ruleForm.remark" rows="3" placeholder="请输入备注"></el-input>
        </el-form-item>

      </el-form>
      <div class="center">
        <el-button @click="close('ruleForm')">关闭</el-button>
        <el-button type="primary" @click="submitForm('ruleForm')" :loading="loading">确认</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import onSelfApi from '@/api/retrieveManage/onSelf.js'
export default {
    name: 'editPrice',
    data() {
        var priceRule = (rule, value, callback) => {
            if (value === '') {
                callback()
            } else {
                if (!this.priceReg.test(value)) {
                    callback(new Error('请输入正确的价格'))
                }
                callback()
            }
        }
        return {
            dialogVisible: false,
            loading: false,
            ruleForm: {
                backAmount: '',
                id: '',
                guaranteeAmount: '',
                securityPhone: '',
                accountPassword: '',
                accountNumber: '',
                remark: ''
            },
            orderInfo: {},
            rules: {
                backAmount: [
                    {
                        required: true,
                        message: '请输入回收金额',
                        trigger: 'blur'
                    },
                    { validator: priceRule, trigger: 'blur' }
                ],
                guaranteeAmount: [
                    {
                        required: true,
                        message: '请输入包赔费',
                        trigger: 'blur'
                    },
                    { validator: priceRule, trigger: 'blur' }
                ]
            },
            userType: ''
        }
    },
    created() {},
    methods: {
        open(order, userType) {
            this.userType = userType
            this.loading = false
            this.orderInfo = order
            this.ruleForm.id = order.id
            this.ruleForm.backAmount = order.backAmount || ''
            this.ruleForm.guaranteeAmount = order.guaranteeAmount
            this.ruleForm.securityPhone = order.securityPhone
            this.ruleForm.accountPassword = order.accountPassword
            this.ruleForm.accountNumber = order.accountNumber
            this.ruleForm.remark = order.remark
            this.dialogVisible = true
        },
        submitForm(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.loading = true
                    onSelfApi
                        .backClueOrderupdateSome(this.ruleForm)
                        .then((res) => {
                            this.dialogVisible = false
                            this.$parent.getList()
                        })
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },
        close(formName) {
            this.dialogVisible = false
        }
    }
}
</script>
<style scoped lang="scss">


::v-deep .el-dialog__body {
    padding-top: 10px !important;
}

.pick-dialog >>> .el-input--medium input {
    text-align: left;
}
</style>
